<nz-tabset>
  <nz-tab nzTitle="网关属性"></nz-tab>
  <nz-tab nzTitle="端口配置">
    <button nz-button [nzType]="'primary'" acl [acl-ability]="37" (click)="newport(-1)">
      <i nz-icon nzType="plus"></i>
      <span>{{ 'button.new' | i18n }}</span>
    </button>
    <st #st [page]="{ show: false }" [data]="ports" [columns]="columns">
      <ng-template st-row="portNameTpl" let-item let-index="index">
        <input *ngIf="item.edit" nz-input [ngModel]="item.portname" (ngModelChange)="st.setRow(index, { portname: $event })" />
        <ng-container *ngIf="!item.edit">{{ item.portname }}</ng-container>
      </ng-template>
      <ng-template st-row="portTypeTpl" let-item let-index="index">
        <nz-select ngModel="item.iotype" *ngIf="item.edit" (ngModelChange)="st.setRow(index, { iotype: $event })">
          <nz-option nzValue="1" nzLabel="输入"></nz-option>
          <nz-option nzValue="2" nzLabel="输出"></nz-option>
        </nz-select>

        <ng-container *ngIf="!item.edit">{{ IOType[item.iotype]?.text }}</ng-container>
      </ng-template>
      <ng-template st-row="portPhyTypeTpl" let-item let-index="index">
        <nz-select ngModel="item.type" *ngIf="item.edit" (ngModelChange)="st.setRow(index, { type: $event })">
          <nz-option nzValue="1" nzLabel="以太网"></nz-option>
          <nz-option nzValue="2" nzLabel="RS232"></nz-option>
          <nz-option nzValue="3" nzLabel="RS485"></nz-option>
          <nz-option nzValue="4" nzLabel="RJ11"></nz-option>
        </nz-select>
        <ng-container *ngIf="!item.edit">{{ TAG[item.type]?.text }}</ng-container>
      </ng-template>
    </st>
  </nz-tab>
  <nz-tab nzTitle="杂项">
    <form nz-form #f="ngForm" se-container="1">
      <se label="X">
        <input type="number" nz-input [(ngModel)]="BizData.x" name="x" />
      </se>
      <se label="Y">
        <input type="number" nz-input [(ngModel)]="BizData.y" name="y" />
      </se>
      <se label="宽度">
        <input type="number" nz-input [(ngModel)]="BizData.width" name="width" />
      </se>
      <se label="高度">
        <input type="number" nz-input [(ngModel)]="BizData.height" name="height" />
      </se>
    </form>
  </nz-tab>
</nz-tabset>
